import React from 'react'
import styles from './demo2.module.css'
import store from '@/store'
import { Button, Input } from 'antd'

class Demo2 extends React.Component {

  state = {
    ...store.getState()
  }

  componentDidMount() {
    console.log(this.state)
  }

  onChange = (e) => {
    store.dispatch({
      type: 'value',
      value: e.target.value
    })
  }

  render() {
    let { list, value } = this.state
    return (
      <div className="demo2">
        <div className={ styles['logo'] }>
          <div className={ styles['logo2'] }></div>
        </div>
        <div className={ styles['logo2'] }></div>
        <div className={ styles['list'] }>
          {
            list.map((item, index) => {
              return (
                <div className={ styles['list-item'] } key={ index }>{ item }</div>
              )
            })
          }
        </div>
        <Input value={ value } onChange={ this.onChange }></Input>
        <Button>新增</Button>
      </div>
    )
  }

}

export default Demo2